<!DOCTYPE html>
<html lang="en">

  <head>
    <meta charset="UTF-8">
    <title>Wavescroll (drag background)</title>
    <link rel="stylesheet" href="./style.css">

  </head>
    
  <body>
  <div class="ws-pages">
  <div class="ws-bgs">
    <div class="ws-bg"></div>
    <div class="ws-bg"></div>
    <div class="ws-bg"></div>
    <div class="ws-bg"></div>
    <div class="ws-bg"></div>
  </div>
  <div class="ws-text">
    <h2 class="ws-text__heading">
      <span>Page 1</span>
      <span>Drag image parts or just scroll down</span>
    </h2>
    <h2 class="ws-text__heading">
      <span>Page 2</span>
    </h2>
    <h2 class="ws-text__heading">
      <span>Page 3</span>
      <span>Still nothing</span>
    </h2>
    <h2 class="ws-text__heading">
      <span>Page 4</span>
    </h2>
    <h2 class="ws-text__heading">
      <span>Page 5</span>
      <span>The end</span>
    </h2>
  </div>
</div>
    <script src='//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/gsap/1.18.2/TweenLite.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/gsap/1.18.2/plugins/CSSPlugin.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/gsap/1.18.2/easing/EasePack.min.js'></script><script  src="./script.js"></script>

  </body>
  
</html>
